.modal-header {
  background-color: $xgx-modal-header-background_color;
  padding: $xgx-modal-header-padding $xgx-modal-header-padding $xgx-modal-header-padding 1rem;
  .close {
    font-weight: lighter;
  }
}

.modal-footer {
  background-color: $xgx-modal-footer-background_color;
  padding: $xgx-modal-footer-padding;
}

//mobile ui
.xgx-model-mobile{
  .modal-dialog {
    margin: 0 auto;
    .modal-content {
      height:calc(100vh);
      border-radius: 0;
      .modal-header{
        min-height: 3rem;
        padding: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        .modal-title{
          line-height: 3rem;
          margin: auto;
        }
        .xgx-modal-header-back{
          line-height:3rem;
          padding-left: 0.75rem;
          font-size: 1.4rem;
          position: absolute;
        }
        .xgx-modal-header-right {
          line-height: 3rem;
          font-size: 1.4rem;
        }
      }
      .modal-body {
        overflow-y:auto;
      }
      .modal-footer{
        min-height: 2.6rem;
        //padding: 0;
        justify-content:center;
        button {
          width: 40%;
        }
      }
    }
  }
  .xgx-modal-dialog-confirm {
    background: rgba(0,0,0,0.1);
    height: calc(100vh);
    padding-top: 3rem;
    transition: unset!important;
  }
}

.modal-dialog {
  .xgx-model-mobile.fade & {
    transform: translate(100%,0);
  }
  .xgx-model-mobile.show & {
    transform: translate(0,0);
  }
}

.modal-lg-900 {
  max-width:900px;
}

.modal-lg-1000 {
  max-width: 1000px;
}

.modal-lg-1100 {
  max-width: 1100px;
}

.modal-lg-1200 {
  max-width: 1200px;
}
